<template>
    <section class="after-type-product-box">
      <img :src="product.path" alt="">
      <div class="inline-block pr msg">
        <p class="fs14 color45454D">{{product.name}}</p>
        <p class="fs12 color999AA3">{{product.model}}</p>
        <p class="pa number">
          <span class="flr fs14 color45454D">x {{product.number}}</span>
        </p>
      </div>
    </section>
</template>

<script type="text/ecmascript-6">
  export default {
    data() {
      return {

      }
    },
    props:['product'],
    methods: {

    },
  }
</script>

<style scoped lang="scss">
  @import '../assets/css/base';

  .after-type-product-box{
    background-color: #fff;
    width: 100%;
    height: 104px;
    padding:12px 15px;
    box-sizing: border-box;

    img{
      width: 80px;
      height: 80px;
      vertical-align: top;
    }

    .msg{
      width:calc(100% - 90px);
      height: 80px;
      padding-left:8px;
      box-sizing: border-box;
    }

    .number{
      bottom:0;
      left:0;
      width: 100%;
    }
  }
</style>
